console.log("Hello World!");
// 项目的入口文件
// 01: 发起一个数据请求
import axios from 'axios'
axios.get('/api/index/index').then(res => {
    console.log('res', res);
});


// 02: 导入一个第三方包
import $ from 'jquery';
$('li:odd').css('background', 'black')
$('li:even').css('background', 'green')

// 03: 将less 文件导入到项目的入口文件中
import '@/assets/index.less';

// 04:  将css 文件导入到项目的入口文件中
import('@/assets/reset.css');

// 05: 
// 添加es6高级语法
class Person {
    static sex = '女'; // 当添加静态属性时,编译报错不支持
    constructor(name) {
        this.name = name
    }
    say() {
        console.log(this.name)
    }
}
let p = new Person('小芳')
console.log(p);
console.log(Person.sex);


// 06:  引入其他js 文件
import arr from './common'
console.log(arr);


// 解释: 
// npm run serve 命令 你是看不到打包后的文件的, 因为该命令操作要实时打包, 如果打包后的文件存到
// 硬盘目录中,非常耗费性能, 所以该命令将打包后文件放到 内存中, 这是实时打包的时候, 比较节省性能


// loader: 用来处理 非 es5的js语法. 默认webpack 只能处理  es5的js语法, 
// 例如 处理css  less  图片等等文件


// 05: 默认 webpack5 默认只能处理背景图, 可以打包背景图,但是处理不了 img 标签图片, 所以需要对应的loader 配置 